<template>
	<view class="body">
		<view class="header">
			<view class="info">
				<uni-row class="demo-uni-row">
					<uni-col :span="4">
						<view class="demo-uni-col dark" @click="uniTo('./updateUser')">
							<image :src="user.img" class="userImg"></image>
						</view>
					</uni-col>
					<uni-col :span="17">
						<view class="demo-uni-col light right" @click="logout()">
							<p><span>{{user.realName}}</span><span>
									<image src="../../static/party_building/assets/setting.png" mode=""></image>
								</span></p>
							<p>求是币:{{fenshu}}
								<uni-tag style="display: inline-block;margin-left:5%;" :text="junxian" type="warning"
									size="small" :circle="true"></uni-tag>
							</p>
						</view>
					</uni-col>
				</uni-row>
				<p>今天是您加入系统的第{{date}}天！</p>
			</view>
		</view>
		<view class="main">
			<!-- 此处使用了魔法值 应该数据库存菜单图片 动态生成菜单-->
			<uni-grid :column="3" borderColor="#ffffff" :highlight="false">
				<!--  <uni-grid-item v-if="hashIndex['1']!==undefined">
			       <view @tap="pageTo(menuMap[hashIndex['1']].menuChild,true)">
					   <image src="../../static/party_building/assets/footprint3x.png" mode=""></image>
					   <p>党支部</p>
				   </view>
			    </uni-grid-item>
			    <uni-grid-item v-if="hashIndex['2']!==undefined">
			       <view @tap="pageTo(menuMap[hashIndex['2']].menuChild,true)">
					   <image src="../../static/party_building/assets/collection3x.png" mode=""></image>
					   <p>纪检部</p>
				   </view>
			    </uni-grid-item>
			    <uni-grid-item  v-if="hashIndex['3']!==undefined">
			       <view @tap="pageTo(menuMap[hashIndex['3']].menuChild,true)">
					   <image src="../../static/party_building/assets/handbook.png" mode=""></image>
					   <p>工会部</p>
				   </view>
			    </uni-grid-item>
			    <uni-grid-item  v-if="hashIndex['4']!==undefined">
			       <view @tap="pageTo(menuMap[hashIndex['4']].menuChild,true)">
					   <image src="../../static/party_building/assets/grouping3x.png" mode=""></image>
					   <p>团支部</p>
				   </view>
			    </uni-grid-item>
			    <uni-grid-item  v-if="hashIndex['5']!==undefined">
			       <view  @tap="pageTo(menuMap[hashIndex['5']].menuChild,true)">
					   <image src="../../static/party_building/assets/draft3x.png" mode=""></image>
					   <p>妇联部</p>
				   </view>
			    </uni-grid-item> -->
				<!-- <uni-grid-item  v-if="hashIndex['6']!==undefined"> -->
				<uni-grid-item>
					<view @tap="pageTo('../relationship/relationship',false)">
						<image src="../../static/party_building/assets/relationship.png" mode=""></image>
						<p>组织关系</p>
					</view>
				</uni-grid-item>

				<!-- 静态目录 -->


				<uni-grid-item>
					<view @tap="pageTo('../notice/notice',false)">
						<image src="../../static/party_building/assets/number.png" mode=""></image>
						<p>首页管理</p>
					</view>
				</uni-grid-item>

				<uni-grid-item>
					<view @tap="pageTo('../develop/develop',false)">
						<image src="../../static/party_building/assets/mine.png" mode=""></image>
						<p>开发人员</p>
					</view>
				</uni-grid-item>

				<uni-grid-item>
					<view @tap="pageTo('/pages/systemUpdate/index',false)">
						<image src="../../static/party_building/assets/responsibility.png" mode=""></image>
						<p>系统更新</p>
					</view>
				</uni-grid-item>

				<uni-grid-item v-if="currentRoleCode.includes('fl-leader')">
					<view @tap="pageTo('/pages/suggestion/index',false)">
						<image src="../../static/party_building/assets/letters.png" mode=""></image>
						<p>意见建议</p>
					</view>
				</uni-grid-item>
				<uni-grid-item v-if="!currentRoleCode.includes('fl-leader')">
					<view @tap="pageTo('/pages/suggestion/add',false)">
						<image src="../../static/party_building/assets/letters.png" mode=""></image>
						<p>意见建议</p>
					</view>
				</uni-grid-item>
			</uni-grid>
		</view>
		<view>
			<myFooter :isSelected.sync="selected" />
		</view>
	</view>
</template>

<script>
	import {
		QSSwich
	} from '@/api/qiushiSwich.js'
	import {
		getUserCoin
	} from '@/api/api_bi.js'
	import myFooter from '../components/index_footer.vue'
	export default {
		data() {
			return {
				value: "",
				selected: 'mine',
				role: '党建部门负责人',
				userImg: "../../static/party_building/assets/userImg.png",
				fenshu: '',
				user: {
					"userId": '',
					"userName": '',
					"password": "",
					"realName": "",
					"birthday": "",
					"phone": "",
					"gender": 1,
					"img": '',
					"createTime": "",
					"createUser": null,
					"updateTime": "",
					"updateUser": null
				},
				date: 101,
				menuMap: [], //树形
				hashIndex: {}, //树形菜单的id
				// 当前用户角色
				currentRoleCode: [],
				junxian:''
			}
		},
		components: {
			myFooter: myFooter
		},
		mounted() {
			getUserCoin().then(res => {
				this.fenshu = res
				this.junxian = QSSwich(res)
			})
			let _this = this
			uni.getStorage({
				key: 'user',
				success: function(res) {
					console.log("user", res)
					_this.user = res.data.user;
				}
			});
			// uni.getStorage({
			//     key: 'menuMap',
			//     success: function (res) {
			//         _this.menuMap = res.data;
			//     }
			// });
			_this.menuMap = uni.getStorageSync("menuMap")
			_this.date = parseInt((Date.parse(new Date()) -
					Date.parse(new Date(_this.user.createTime))) /
				(1000 * 60 * 60 * 24)) //获取天数
			_this.hashIndex = {},
				_this.menuMap.forEach((item, index) => { //形成 departId，index，映射
					_this.hashIndex[item.departId] = index
				})
			console.log(this.menuMap, this.hashIndex)
			this.getLoginUserRoles();
		},
		methods: {
			pageTo(val, isMenuChild) { //（跳转菜单，是否有子菜单）
				if (isMenuChild) {
					uni.navigateTo({
						url: `../components/loadBuilding?param=${JSON.stringify(val)}`
					})
				} else {
					uni.navigateTo({
						url: val
					})
				}
			},
			uniTo(ars) {
				uni.navigateTo({
					url: ars
				})
			},
			logout() {
				uni.showModal({
					title: '提示',
					content: '是否退出登陆？',
					success: function(res) {
						if (res.confirm) {
							uni.clearStorage();
							uni.reLaunch({
								url: '/pages/login/login',
								success() {
									plus.cache.clear( clearCB );
								}
							})
						}
					},
				})
			},
			// 获取登录用户角色
			getLoginUserRoles() {
				let _this = this;
				uni.getStorage({
					key: 'user',
					success(e) {
						let arr = [];
						for (let item of e.data.role) {
							if (null != item.roleCode) {
								_this.currentRoleCode.push(item.roleCode)
							}
						}
					}
				})
			},
		},
	}
</script>
<style lang="scss" scoped>
	.body {
		background-color: #f7f7f7;
		height: 100%;
	}

	.header {
		width: 100%;
		height: 350upx;
		background: linear-gradient(0deg, #e20909, #ff5e59);
		border-radius: 0 0 1rem 1rem;

		.info {
			width: 95%;
			height: 200upx;
			background-image: url(../../static/party_building/assets/mine_bg.png);
			background-repeat: no-repeat;
			background-size: 100% 100%;
			-moz-background-size: 100% 100%;
			margin: 0 auto;
			position: relative;
			bottom: -60%;
			border-radius: .5rem;

			.userImg {
				width: 150upx;
				height: 150upx;
				position: relative;
				border-radius: 50%;
				top: -50upx;
				left: 50upx;
			}

			/deep/ .demo-uni-row {
				.uni-col-17 {
					float: right;

					.right {
						p:nth-child(1) {
							font-family: PingFangSC-Semibold, sans-serif;
							font-size: 1rem;
							color: #333;
							margin: .2rem 0;

							image {
								float: right;
								margin-right: 20upx;
								width: 50upx;
								height: 50upx;
							}
						}

						p:nth-child(2) {
							font-family: PingFangSC-Regular, sans-serif;
							font-size: 24upx;
							color: #666;
							margin: .1rem 0;
						}
					}
				}
			}

			p {
				width: 90%;
				margin: -30upx 0 0 30upx;
				font-family: PingFangSC-Regular, sans-serif;
				font-size: .8rem;
				color: #333;
			}
		}
	}

	.main {
		border-radius: 2%;
		overflow: hidden;
		width: 95%;
		min-height: 11.68rem;
		max-height: 53%;
		background: #fff;
		margin: 105upx auto 0;

		/deep/ .uni-grid-wrap {
			.uni-grid-item {
				height: 80upx;

				// text-align: center;
				.uni-grid-item__box {
					position: relative;
					top: 25%;
					left: 25%;

					>uni-view {
						uni-image{
							margin-left:10%;
						}
						// width:100%;
						// margin-right: 50%;
						// text-align: center
					}

					image {
						width: 35px;
						height: 33px;
						// width: 40px;
						// height: 36px;
					}
				}
			}
		}
	}
</style>
